import React,{useState} from 'react'
import {View, StyleSheet, Button, Text, ScrollView, Image, TextInput} from 'react-native';
import {ThemeColor} from '../utils/common';
import {useHeaderHeight} from '@react-navigation/elements';
import {useNavigation} from '@react-navigation/native';
import screen from '../utils/screen';
import TouchableView from '../components/touchableView';
import Images from '../images/Images';
import LGBtn from '../components/touchableView/lgBtn';
import DocumentPicker from 'react-native-document-picker'

const SendAssets = ()=>{

    const [showSuccess,setShowSuccess] = useState(false)

    const headerHeight = useHeaderHeight()
    const navigation = useNavigation()

    const openPicker = ()=>{
        DocumentPicker.pickDirectory().then((res)=>{
            console.log('picker res:',res);
        }).catch(error=>{
            console.log('picker err:',error);
        })
    }

    return (
        <View style={[styles.container,{paddingTop:headerHeight}]}>
            <ScrollView
                contentContainerStyle={{paddingTop:3,paddingHorizontal:20}}
            >
                <View style={styles.itemHeader}>
                    <Text style={styles.title}>接收地址：</Text>
                    <TouchableView
                        style={styles.rightBtn}
                        onPress={()=>{

                        }}
                    >
                        <Text style={{color:'#1F52F9',fontSize:screen.PIXEL_24}}>复制地址</Text>

                    </TouchableView>
                </View>

                <Text style={styles.value}>{account.address}</Text>
                <View style={styles.line}/>

                <View style={[styles.itemHeader,{marginTop:40}]}>
                    <Text style={styles.title}>发送地址：</Text>
                    <TouchableView
                        style={[styles.rightBtn,{width:screen.PIXEL_150}]}
                        onPress={()=>{

                        }}
                    >
                        <Text style={{color:'#1F52F9',fontSize:screen.PIXEL_24}}>二维码识别</Text>

                    </TouchableView>
                </View>

                <TextInput
                    style={styles.input}
                    cursorColor={'#333'}
                    placeholder={'请输入'}
                    placeholderTextColor={'#666'}
                />

                <View style={styles.line}/>

                <Text style={styles.title}>请选择本地加密文件</Text>
                <TouchableView
                    style={styles.addBtn}
                    onPress={openPicker}
                >
                    <Image source={Images.add_icon} style={{width:14,height:14,tintColor:'#333'}} resizeMode={'contain'}/>
                </TouchableView>


            </ScrollView>

            <LGBtn
                title={'下一步'}
                style={styles.nextBtn}
                onPress={()=>{
                    navigation.navigate('DecodeSuccess',{title:'接收个人数字资产',isSend:true})
                }}
            />

        </View>
    )
}

export default SendAssets

const styles = StyleSheet.create({
    container:{
        flex:1, backgroundColor:ThemeColor.theme
    },
    itemHeader:{
        flexDirection: 'row',alignItems:'center',justifyContent:'space-between'
    },
    addBtn:{
        width:80,height:80,borderWidth: 1,borderColor: '#ACACAC',justifyContent: 'center',alignItems: 'center',
        marginTop:10,borderRadius: 5
    },
    input:{
        color:'#333',flex:1,height:80,backgroundColor:'#eee',marginTop: 10,borderRadius:4,
        textAlignVertical:'top',padding:10
    },
    rightBtn:{
        width:screen.PIXEL_120,height: screen.PIXEL_40,flexDirection:'row',borderRadius:60,
        justifyContent:'center',alignItems:'center',borderWidth:0.3,borderColor: '#1F52F9'
    },
    content:{
        backgroundColor: '#F6F8FB',padding:screen.PIXEL_24,borderRadius:screen.PIXEL_16,
        marginTop:30
    },
    title:{
        color:'#666',fontSize:15
    },
    value:{
        color:'#333',fontSize:16,fontWeight:'500'
    },
    line:{
        height:0.3,backgroundColor: '#eee',width:'100%',marginVertical: 10
    },
    nextBtn:{
        alignSelf:'center',marginVertical:30
    }
})
